<template>
	<div class="app-container">
		<div class="downStream3">
			<div class="down-top">
				<el-steps :active="3" finish-status="end" process-status='curt' class="nextnav"  simple>
				  <el-step title="导入文件" icon="iconfont icon-1" ></el-step>
				  <el-step title="保单校验" icon="iconfont icon-2"></el-step>
				  <el-step title="结算完成" icon="iconfont icon-3"></el-step>
				</el-steps>
			</div>
			<div class="down-img">
				<img src="../../../assets/images/success.png"/>
			</div>
			<div class="down-text">结算成功!</div>
			<div class="down-table">
				<table class="settletable" border="1" cellpadding="6" cellspacing="0">
				  	<tr>
				  		<td width="25%"></td>
				  		<td width="25%">条数</td>
				  		<td width="25%">政策金额</td>
				  		<td width="25%">实结金额</td>
				  	</tr>
				  	<tr>
				  		<td style="text-align:left;">共搜索保单</td>
				  		<td>{{settleTableData.totalCount}}</td>
				  		<td>{{settleTableData.exportTotalCost | numFilter}}</td>
				  		<td>{{settleTableData.exportATotalCost | numFilter}}</td>
				  	</tr>
				  	<tr class="setB">
				  		<td style="text-align:left;">本次结算保单</td>
				  		<td>{{settleTableData.salesmanCount}}</td>
				  		<td>{{settleTableData.salesmanTotalCost | numFilter}}</td>
				  		<td>{{settleTableData.salesmanATotalCost | numFilter}}</td>
				  	</tr>
				  	<tr>
				  		<td style="text-align:left;">暂未结算保单</td>
				  		<td>{{settleTableData.notSalesmanCount}}</td>
				  		<td>{{settleTableData.notSalesmanTotalCost | numFilter}}</td>
				  		<td>{{settleTableData.notSalesmanActionTotalCost | numFilter}}</td>
				  	</tr>
				  </table>
				<a class="outData" @click="toImport">导出数据</a>
			</div>
			<div class="down-btn">
				<el-button type='primary' size='small' class='wd190' @click='goOn'>继续下游结算</el-button>
			</div>
		</div>
	</div>

</template>

<script>
	export default{
		data(){
			return{
				settleTableData:{},
				id:null
			}
		},
		mounted(){
			if(this.$route.query.id){
				this.id = this.$route.query.id;
			}
			this.tosettle()
		},
		filters:{
			numFilter(val) {
		    // 截取当前数据到小数点后两位
		    // let realVal = Number(val).toFixed(2)
		    // num.toFixed(2)获取的是字符串
		    // return Number(realVal)
		    if(val || val == 0){
		    	val = val.toString().replace(/\$|\,/g,'');
			    if(isNaN(val)) {
			      val = "0";  
			    }
			    let sign = (val == (val = Math.abs(val)));
			    val = Math.floor(val*100+0.50000000001);
			    let cents = val%100;
			    val = Math.floor(val/100).toString();
			    if(cents<10) {
			       cents = "0" + cents
			    }
			    for (var i = 0; i < Math.floor((val.length-(1+i))/3); i++) {
			        val = val.substring(0,val.length-(4*i+3))+',' + val.substring(val.length-(4*i+3));
			    }

			    return (((sign)?'':'-') + val + '.' + cents);
		    }
		  },
		},
		methods:{
			// 结算信息
		    tosettle(){
				const _this = this;
		    	this.dialogVisible = true;
		    	let params = {
		    		// id :'8b8e91dd-169c-4e22-9a69-a17976641a74'
		    		id:this.id
		    	}
		    	this.post(params,'services/app/settle/GetLowerGuaranteeSlipTempStat').then(rs =>{
		    		if(rs.success){
		    			_this.settleTableData = rs.result;
		    		}
		    	})
		    },
			// 导出
			toImport(){
				let params = {
					id : this.id
				};
				this.post(params,'services/app/settle/ExportSettlementLowerList').then(rs => {
					if(rs.success){
						console.log(rs.result);
						if(rs.result.state == 0){
							window.location.href = rs.result.filePath;
						}else if(rs.result.state == 1){
								this.$notify.error({
									title: '失败',
									message: rs.result.errorMessage,
									//duration: 0,
								});
						}else if(rs.result.state == 2){
								this.$notify.error({
									title: '失败',
									message: '该批次下没有要下载的数据',
									//duration: 0,
								});
						}
					}
				})
			},
		    goOn(){
		    	this.$router.push({
		    		name:'financedown'
		    	})
		    }
		}
	}
</script>

<style lang="scss" scoped>
	.app-container{
		.downStream3{
			width:100%;
			.down-top{
				margin-top: 55px;padding: 0 20px;margin-bottom: 50px;
			}
			.down-img{
				text-align: center;
				margin-top: 100px;
				img{
					width:120px;
					height: 120px;
				}
			}
			.down-text{
				color:#333;
				font-size: 24px;
				text-align: center;
				margin-top: 60px;
				margin-bottom:30px;
			}
			.down-table{
				text-align:center;
				position:relative;
				.settletable{
					border:1px solid #efefef;
					margin:20px auto;
					text-align:right;
					width:500px;
					.setB{
						font-weight:700;
					}
					td{
						border:1px solid #efefef;
					}
				}
				.outData{
					position: relative;
					top: -42px;
    				left: 290px;
    				color:#027DCA;
    				font-size:13px;
				}
			}
			.down-btn{
				text-align:center;
				margin-bottom: 50px;
				.wd190{
					width:190px;
				}
			}
		}
	}
</style>